import React, { useState, useEffect } from "react";
import { useParams, useNavigate } from "react-router-dom";
import { Card, Badge, Descriptions, Button } from "antd";
import { reqHospitalShow } from "@/api/hospital/hospitalList/index";
import {
  IhospitalShow,
  IHospitalItem,
} from "@/api/hospital/hospitalList/model/hospitalListTypes";
const HospitalShow = () => {
  const { id } = useParams();
  const navigate = useNavigate();
  const [show, setShow] = useState<IhospitalShow>({});
  useEffect(() => {
    const fetch = async () => {
      const res = await reqHospitalShow(id as string);
      console.log(res);

      setShow(res);
    };
    fetch();
  }, []);
  return (
    <Card>
      <Descriptions title="基本信息" bordered column={2}>
        <Descriptions.Item label="医院名称">
          {show.hospital?.hosname}
        </Descriptions.Item>
        <Descriptions.Item label="医院logo">
          <img
            src={`data:image/jpeg;base64,` + show.hospital?.logoData}
            width={100}
          ></img>
        </Descriptions.Item>
        <Descriptions.Item label="医院编码">
          {show.hospital?.hoscode}
        </Descriptions.Item>
        <Descriptions.Item label="医院地址">
          {show.hospital?.param.fullAddress}
        </Descriptions.Item>
        <Descriptions.Item label="坐车路线" span={2}>
          {show.hospital?.route}
        </Descriptions.Item>
        <Descriptions.Item label="医院简介" span={2}>
          {show.hospital?.intro}
        </Descriptions.Item>
      </Descriptions>
      <Descriptions title="预约规则信息" bordered column={2} style={{ marginTop: 20 }}>
        <Descriptions.Item label="预约周期">
          {show.bookingRule?.cycle}
        </Descriptions.Item>
        <Descriptions.Item label="放号时间">
          {show.bookingRule?.releaseTime}
        </Descriptions.Item>
        <Descriptions.Item label="停挂时间">
          {show.bookingRule?.stopTime}
        </Descriptions.Item>
        <Descriptions.Item label="退号时间">
          {show.bookingRule?.quitTime}
        </Descriptions.Item>
        <Descriptions.Item label="预约规则" span={2}>
          {show?.bookingRule?.rule.map((item, index) => {
            return (
              <div key={index}>
                {index + 1}.{item}
              </div>
            );
          })}
        </Descriptions.Item>
      </Descriptions>
      <Button
        style={{ marginTop: 20 }}
        onClick={() => {
          navigate(-1);
        }}
      >
        返回
      </Button>
    </Card>
  );
};

export default HospitalShow;
